<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<title>积分商城</title>
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta http-equiv="Cache-Control" content="no-transform">
		<meta name="format-detection" content="telephone=no">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
		<link rel="stylesheet" href="style/css/basic.css" />
		<link rel="stylesheet" href="style/plugin/swiper/css/swiper.min.css" />
		<link rel="stylesheet" href="style/css/integral_mall.css" />
		<script type="text/javascript" src="style/plugin/swiper/js/swiper.min.js"></script>
		<script type="text/javascript" src="style/plugin/mui/js/mui.min.js"></script>
		<script type="text/javascript" src="style/js/jquery-1.8.3.min.js"></script>
		<script type="text/javascript" src="style/mockjs/dist/mock.js"></script>
		<script type="text/javascript" src="style/js/vue.min.js"></script>
		<script type="text/javascript" src="style/js/vue-resource.js"></script>
		<script type="text/javascript" src="style/js/basic.js"></script>
	</head>

	<body>
		<div id="jifen">
		    <div id="header">
				<h1>积分商城</h1>
				<a href="javascript:;" @tap="jumpminxi"><span class="righticon icon_my"></span></a>
			</div>
			<div class="body">
				<div class="swiper-container carousel">
					<div class="swiper-wrapper">
						<div class="swiper-slide" v-for="(item,index) in intelunbo">
							<a href="javascript:;"><img :src="htp+item.pic"></a>
						</div>
						<!--<div class="swiper-slide">
							<a href=""><img src="style/img/swiper2.jpg"></a>
						</div> 
						<div class="swiper-slide">
							<a href=""><img src="style/img/swiper1.jpg"></a>
						</div>-->
					</div>
					<div class="swiper-pagination carousel-pagination"></div>
				</div>
				<div class="classfication">
					<div>
						<h2 class="hot">热门推荐</h2>
					</div>
					<div class="swiper-container hot-product">
						<div class="swiper-wrapper">
							<div class="swiper-slide" v-for="(rec,index) in hotrec" v-if="hotrec!=''" @tap="jumpdetail(index)">
								<a href="javascript:;">
									<img :src="htp+rec.thumb_pic">
									<span>{{rec.title}}</span>
									<em>{{rec.price}}积分</em>
								</a>
							</div>
						</div>
					</div>
				</div>
				<div class="classfication">
					<div class="classfication_title">
						<div>
							<h2>产品分类</h2>
							<a href="javascript:;" class="more" @tap="jumpmore">更多</a>
						</div>
	 
					</div>
					<div class="list">
						<ul class="clearfix">
							<li v-for="(type,index) in protype" @tap="jumptype(index)">
								<a href="javascript:void(0);">
									<span>{{type.title}}</span>
									<!--<i class="bg_ele" :style="{backgroundImage:type.thumb_pic}"></i> -->
									<img :src="htp+type.thumb_pic" class="typeimg"/>
								</a>
							</li>  
						</ul>
					</div>
				</div>
			</div>	
		</div> 

		<!--footer-->
		<div class="footer" id="footer">
			<ul class="clearfix">
				<li>
					<a href='agent_index.html' target="_blank"><i class="icon_home"></i><span>首页</span></a>
				</li>
				<li>
					<a href="product.html" target="_blank"><i class="icon_mall"></i><span>商城</span></a>
				</li>
				<li>
					<a href='integral_mall.html' target="_blank"><i class="icon_integral"></i><span class="active_color">积分</span></a>
				</li>
				<li>
					<a href='agent_my.html' target="_blank"><i class="icon_my"></i><span>我的</span></a>
				</li>
			</ul>
		</div>
	</body>
	<script>
		new Vue({
			el:"#jifen",
			data:{
				msg:"",
				hotrec:"",
				intelunbo:"",
				protype:"",
				htp:"",
				ticket:"",
				sign:""
			},
			methods:{
				jumpdetail:function(dIndex){
					openurl_can("product_details",this.hotrec[dIndex].good_no)
				},
				jumpminxi:function(){
					openurl("integral_subsidiary")
				},
				jumpmore:function(){
					localStorage.setItem("nidx","none") 
					openurl("product_list")
				},
				jumptype:function(tIndex){
					localStorage.setItem("nidx",tIndex)
					openurl("product_list")
				}
			},
			created:function(){
				this.ticket=localStorage.getItem("tick")
                this.sign=localStorage.getItem("sig")
				this.$http.post(domain+"/picture/getList?t="+this.ticket+"&sign="+this.sign,{
					scope:8
				},{emulateJSON:true}).then(//获取轮播图
		            function (res) {
		                // 处理成功的结果 
		                if(res.body.code==1){
		                  console.log(res.body)	
		                  this.intelunbo=res.body.data.list;
		                } 
		            },function (res) {
		            // 处理失败的结果
		            console.log(res) 
		            }
		        );
		        this.$http.post(domain+"/score_good/getList?t="+this.ticket+"&sign="+this.sign,{
		        	page:1,
		        	hot:1
		        },{emulateJSON:true}).then(
		            function (res) {
		                // 处理成功的结果
		                if(res.body.code==1){
		                  console.log(res.body)	
		                  this.hotrec=res.body.data.list;
		                } 
		            },function (res) {
		            // 处理失败的结果
		            console.log(res) 
		            }
		        );
		        this.$http.post(domain+"/score_good/getCategoryList?t="+this.ticket+"&sign="+this.sign,{emulateJSON:true}).then(
		            function (res) {
		                // 处理成功的结果
		                if(res.body.code==1){ 
		                	
		                  console.log(res.body)	
		                  this.protype=res.body.data;
		                  
		                } 
		            },function (res) {
		            // 处理失败的结果
		            console.log(res) 
		            }
		        );
			},
			mounted:function(){
				this.htp=domain2
				setTimeout(function(){
					var swiper = new Swiper('.carousel', {
					spaceBetween: 30,
					centeredSlides: true,
					autoplay: {
						delay: 2500,
						disableOnInteraction: false,
					},
					pagination: {
						el: '.carousel-pagination',
						clickable: true,
						dynamicBullets: true,
					},
		
				});
					
				},500)
				
			},
			updated:function(){
				var swiper = new Swiper('.hot-product', {
					slidesPerView: 3,
					spaceBetween: 30,
					pagination: {
						el: '.hot-pagination',
						clickable: true,
					},
				});
			}
		})
		

		
	</script>

</html>